<template>
  <el-card shadow="always" header="基础告警配置">
    <el-scrollbar class="warnSetH">
      <el-table
        class="paramsTable"
        ref="multipleTableRef"
        :data="baseConfig.config.list"
        style="width: 100%"
      >
        <el-table-column prop="title" label="设置" />
        <el-table-column prop="value" label="当前值">
          <template #default="scope">
            <span style="font-size: 24px; padding-right: 5px">{{
              scope.row.value
            }}</span>
            <span style="color: #999">{{ scope.row.unit }}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column width="100">
                    <template #default="scope">
                        <component is="Setting" @click="handleClick(scope.row)"
                            style=" width: 1.3em; height: 1.3em;color: green; cursor: pointer;">
                        </component>
                    </template>
                </el-table-column> -->
      </el-table>
    </el-scrollbar>
  </el-card>
</template>
<script lang="ts" setup>
import type {
  FormInstance,
  TabsPaneContext,
  FormItemRule,
  FormRules,
} from "element-plus";
import { useBackendMonitor } from "@/store/backend/EquipM/monitor";
import { reactive, ref, onMounted, watch, nextTick } from "vue";

const monitor = useBackendMonitor(); //实时监控仓库

interface anyObj {
  [key: string]: any;
}
//基础配置设置
const baseConfig: {
  config: anyObj; //配置数据
  showChangeForm: boolean; //打开修改告警配置表单
  rules: Partial<Record<string, FormItemRule[]>>; //验证规则
  form: anyObj;
  showForm: boolean;
} = reactive({
  config: [],
  showChangeForm: false,
  rules: {},
  form: {},
  showForm: false,
});

const emit = defineEmits(["open-warn-set"]);
const handleClick = (row: any) => {
  emit("open-warn-set", row);
};

onMounted(() => {});
</script>
<style lang="scss" scoped>
.warnSetH {
  height: 400px;
}
</style>
